
{% extends 'base.html.twig' %}

{% block stylesheets %}
{{ css('css/sweet-alert.css') }}    
<style>
    body { background-color: #C61C02; }
    .form-wrapper { width: 180px; margin: 0 auto; color: #fff; font-size: 22px; font-weight: 700; }
    .myform { position: absolute; top: 38%; width: 180px; }
    .myform input, .myform textarea { 
        background: none; padding: 5px; background-color: rgba(3, 3, 3, 0.5); 
        display: block; box-sizing: border-box; border-radius: 10px;
        width: 100%; font-size: 16px; color: #fff;
    }
    .myform input::-webkit-input-placeholder  {
        color: white; text-shadow: none; 
    }
    .search-title { text-align: center; }
    .inp-wrapper { margin: 5px auto; }
    #btnsubmit { width: 117px; margin: 0 auto; display: block; }
    #btnsubmit img { width: 100%; }
    .lucky, .unlucky { text-align: center; top: 38%; position: absolute; width: 180px; }
    .lucky table { margin: 0 auto; width: 180px; }
    @media all and (min-width: 370px) {
        .form-wrapper { font-size: 26px; font-weight: 700; }
        .myform input { font-size: 18px; }
    }
</style>
{% endblock %}

{% block body %}

<img style='width:100%; ' src='{{ imgsrc("images/searchbg.jpg") }}?v=3'>
<div class='form-wrapper'>
    {% if flag %}
    <div class='lucky'>
        <div class='lucky-title'>恭喜您</div>
        <table id='mytable'>
            {% for i in 1..3 %}
                {% if data[i-1] %}
                    <tr><td>获得{{ i }}等奖{{ data[i-1] }}份</td></tr>
                {% endif %}
            {% endfor %}
        </table>
    </div>
    {% else %}
    <div class='unlucky'>未查询到中奖信息</div>
    {% endif %}
</div>
{% endblock %}
{% block javascripts %}
{{ js('js/sweet-alert.min.js') }}
<script>

$(function(){
    
});

</script>
{% endblock %}
